<template>
  <div :style="styleName"></div>
</template>

<script>
export default {
  props: {
    config: {
      type: Object,
      default: () => ({}),
    },
  },
  computed: {
    styleName() {
      return {
        width: `${this.config.width}pt`,
        height: "0",
        borderBottom:this.config.borderColor?`${this.config.height}pt ${this.config.borderLine} ${this.config.borderColor}`:'',
        opacity: this.config.opacity / 100,
        transitionProperty: 'all',
        transform:  `rotateX(0deg) rotateY(0deg) rotateZ(${this.config.rotate}deg)`,//
        borderRadius: this.config.borderRadius + 'pt'
      };
    },
  },
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {},
};
</script>